<include file="common:header" />

<!-- 头像 名称 号码 -->
<div class="weui-cells">
    <div class="weui-cell">
    <!-- <a class="weui-cell weui-cell_access open-popup" data-target="#avatar_info" > -->
        <div class="weui-cell__hd" style="position: relative;margin-right: 10px;">
            <img src="{$user['weixin_avatar']}" style="width: 60px;display: block">
        </div>
        <div class="weui-cell__bd">
            <p class="register_name">{$user['user_name']}</p>
        </div>
        <div class="weui-cell__ft"></div>
    <!-- </a> -->
    </div>
</div>
<!-- 头像 名称 号码 -->

<!-- 主体内容 -->
<div class="weui-tab__panel">
	<form id="videoOrderForm">
	<div class="weui-cells">
        <div class="weui-cell weui-cell_select weui-cell_select-after">
            <div class="weui-cell__hd">
                <label for="" class="weui-label">预定项目<span style="color: red;">*</span></label>
            </div>
            <div class="weui-cell__bd">
                <select class="weui-select" name="projectID">
                    <option value="1">宝宝出生视频服务</option>
                </select>
            </div>
        </div>
    </div>
	<div class="weui-cells">
		<div class="weui-cell weui-cell_select weui-cell_select-after">
	        <div class="weui-cell__hd"><label class="weui-label">预约城市<span style="color: red;">*</span></label></div>
	        <div class="weui-cell__bd">
	        	<select class="weui-select selectProvince" name="provinceID">
                    <option value="">请选择</option>
	        		<foreach name="province" item="so" >
						<option value="{$so.provinceid}">{$so.provincename}</option>
					</foreach>
                </select>
	        </div>
	        <div class="weui-cell__bd">
	        	<select class="weui-select selectCity" name="cityID">
                    <option value="">请选择</option>
                    <!-- <foreach name="city" item="so" >
						<option value="{$so.cityid}">{$so.cityname}</option>
					</foreach> -->
	        	</select>
	        </div>
	        <div class="weui-cell__bd">
	        	<select class="weui-select selectDistrict" name="districtID">
                    <option value="">请选择</option>
	        	</select>
	        </div>
	    </div>
	    <div class="weui-cell weui-cell_select weui-cell_select-after">
	        <div class="weui-cell__hd"><label class="weui-label">所在医院<span style="color: red;">*</span></label></div>
	        <div class="weui-cell__bd">
	            <select class="weui-select selectHispital" name="hospitalID">
                    <option value="">--请选择--</option>
                </select>
	        </div>
	    </div>
	    <div class="weui-cell weui-cell_access">
	        <div class="weui-cell__hd"><label class="weui-label">妈妈姓名<span style="color: red;">*</span></label></div>
	        <div class="weui-cell__bd">
	            <input class="weui-input" type="text" name="monther_name" placeholder="请输入妈妈姓名">
	        </div>
	    </div>
	    <div class="weui-cell weui-cell_access">
	        <div class="weui-cell__hd"><label class="weui-label">爸爸姓名<span style="color: red;">*</span></label></div>
	        <div class="weui-cell__bd">
	            <input class="weui-input" type="text" name="father_name" placeholder="请输入爸爸姓名">
	        </div>
	    </div>
	    <!-- <div class="weui-cell weui-cell_access">
	        <div class="weui-cell__hd"><label class="weui-label">联系人<span style="color: red;">*</span></label></div>
	        <div class="weui-cell__bd">
	            <input class="weui-input" type="text" name="parents_name" placeholder="请输入联系人" >
	        </div>
	    </div> -->
	    <div class="weui-cell weui-cell_access">
	        <div class="weui-cell__hd"><label class="weui-label">联系手机<span style="color: red;">*</span></label></div>
	        <div class="weui-cell__bd">
	            <input class="weui-input" type="tel" name="parents_phone" pattern="/^1(3[0-9]|4[57]|5[0-35-9]|7[0135678]|8[0-9])\\d{8}$/" required  placeholder="请输入手机号" >
	        </div>
	    </div>
	    <div class="weui-cell weui-cell_access">
	        <div class="weui-cell__hd"><label class="weui-label">住院编号<span style="color: red;">*</span></label></div>
	        <div class="weui-cell__bd">
	            <input class="weui-input" type="text" name="hospitalNO" placeholder="请输入住院编号" >
	        </div>
	    </div>
	</div>

	<div class="weui-cells__title">温馨提示：住院编号会影响到宝宝视频的采集，请爸爸妈妈们务必填写正确的住院编号。</div>

	<!-- 协议 -->
	<div class="weui-flex">
	  <div class="weui-flex__item">
		<label for="weuiAgree" class="weui-agree">
		    <input id="weuiAgree" type="checkbox" class="weui-agree__checkbox" >
		    <span class="weui-agree__text">
		        是否同意注册协议<a href="javascript:;"></a>
		    </span>
		</label>
	  </div>
	  <div class="weui-flex__item">
		<span class="weui-agree"><a class="open-popup" data-target="#gvrp_info" href="javascript:;">《注册协议》</a></span>
	  </div>
	</div>
	<!-- 协议 -->

	<!-- 立即提交 -->
	<div class="weui-btn-area">
	    <a href="javascript:;" class="weui-btn weui-btn_primary weui-btn_disabled comfirm">立即提交</a>
	</div>
	<!-- 立即提交 -->
	</form>
</div>
<!-- 主体内容 -->

<script type="text/javascript">
$(document).ready(function(){
	$('title').html('初生视频预定');

	var cityData = <?php echo json_encode($city);?>;
	var districtData = <?php echo json_encode($district);?>;
	var hospitalData = <?php echo json_encode($hospital);?>;
	var savePostData = {};

	//选择省份--市
	$(".selectProvince").on('change', function() {
		savePostData.proVal = $(".selectProvince").val();
		var cityHtml = "<option value=\"\">--请选择--</option>";
		$.each(cityData,function(index, el) {
			if (el.provinceid==savePostData.proVal) { //符合对应的【省份】
				cityHtml += "<option value=\""+el.cityid+"\">"+el.cityname+"</option>";
			}
		});
		$(".selectCity").html(cityHtml);
	});

	//选择市--所在区
	$(".selectCity").on('change', function() {
		savePostData.cityVal = $(".selectCity").val();
		var cityHtml = "<option value=\"\">请选择</option>";
		$.each(districtData,function(index, el) {
			if (el.cityid==savePostData.cityVal) { //符合对应的【省市】
				cityHtml += "<option value=\""+el.districtid+"\">"+el.districtname+"</option>";
			}
		});
		$(".selectDistrict").html(cityHtml);
	});

	//选择区--所在医院
	$(".selectDistrict").on('change', function() {
		savePostData.disVal = $(".selectDistrict").val();
		var cityHtml = "<option value=\"\">请选择</option>";
		$.each(hospitalData,function(index, el) {
			if (el.province_id==savePostData.proVal && el.city_id==savePostData.cityVal && el.district_id==savePostData.disVal) {
				//符合对应的【省市区】
				cityHtml += "<option value=\""+el.id+"\">"+el.hospital_name+"</option>";
			}
		});
		$(".selectHispital").html(cityHtml);
	});

	//选择医院--对应的预约价格
	$(".selectHispital").change(function(){
		<foreach name="hospital" item="h">
			if($(this).val() == {$h.id}){
				$('.comfirm').html('立即预约 ￥'+{$h.hospital_price});
			}
		</foreach>
	});

	// 是否打勾《注册协议》
	$('#weuiAgree').on('click', function() {
		if ($(this).prop('checked')) {
			$('.comfirm').removeClass('weui-btn_disabled');
		}else{
			$('.comfirm').addClass('weui-btn_disabled');
		}

	});

	function checkNumber(){
		// var re = /^1(3[0-9]|4[57]|5[0-35-9]|7[0135678]|8[0-9])\\d{8}$/;
		var mobilevalid = /^(0|86|17951)?(13[0-9]|15[012356789]|17[0678]|18[0-9]|14[57])[0-9]{8}$/;
		var str = $('input[name=parents_phone]').val();
		if(mobilevalid.test(str)){
	        return true;
	    }
	    else{
	        return false;
	    }
	}

	// 提交成功
	$('.comfirm').on('click', function(){
		if (!$('.comfirm').hasClass('weui-btn_disabled')) {
			if ( $('input[name=projectID]').val()=='' ) {
				layerCallBackTips('请选择预定项目');
				return false;
			}else if( $('select[name=provinceID]').val()=='' ){ /*联系方式必填*/
				layerCallBackTips('请选择省份');
				return false;
			}else if( $('select[name=cityID]').val()=='' ){ /*備註必填*/
				layerCallBackTips('请选择城市');
				return false;
			}else if( $('select[name=districtID]').val()=='' ){ /*備註必填*/
				layerCallBackTips('请选择区县');
				return false;
			}else if( $('select[name=hospitalID]').val()=='' ){ /*備註必填*/
				layerCallBackTips('请选择医院');
				return false;
			}else if( $('input[name=monther_name]').val()=='' ){ /*備註必填*/
				layerCallBackTips('请填写妈妈姓名');
				return false;
			}else if( $('input[name=father_name]').val()=='' ){ /*備註必填*/
				layerCallBackTips('请填写爸爸姓名');
				return false;
			}else if( $('input[name=parents_name]').val()=='' ){ /*備註必填*/
				layerCallBackTips('请填写联系人');
				return false;
			}else if( $('input[name=parents_phone]').val()=='' || !checkNumber() ){ /*備註必填*/
				layerCallBackTips('请填写正确联系号码');
				return false;
			}else if( $('input[name=hospitalNO]').val()=='' ){ /*備註必填*/
				layerCallBackTips('请填写住院编号');
				return false;
			}
			//取消勾选协议
			$('#weuiAgree').attr("checked",false);
			$.post("{:U(MODULE_NAME.'/'.CONTROLLER_NAME.'/saveVideoOrder')}",$('#videoOrderForm').serialize(),function(data){
				if (data.status) {
					$.toast(data.info , function() {
			          window.location.href = data.url;
			        });
				}
			});
		}else{
			layerCallBackTips('请勾上注册协议');
		}
    });

});

</script>

<!-- 遮罩层 -->

<!-- popup 人物-->
<div id="gvrp_info" class="weui-popup__container">
    <div class="weui-popup__overlay"></div>
    <div class="weui-popup__modal">
    	<div class="weui-tab__panel">
			<include file="common:user_xieyi" />
		    <div class="weui-btn-area">
			    <a href="javascript:;" class="weui-btn weui-btn_primary close-popup">关闭</a>
			</div>
		</div>
    </div>
</div>
<!-- popup 人物 -->

<!-- 遮罩层 -->

